<!--
分页组件
父组件传入:total
 -->

<template>
  <div>
    <el-pagination
      @size-change="handleSizeChange"
      background=""
      @current-change="handleCurrentChange"
      :current-page.sync="SoncurrentPage"
      :page-sizes="pagesizelist"
      :page-size="SonPagesize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total"
    ></el-pagination>
  </div>
</template>
<script>
export default {
  props: {
    total: {
      //总条数
      type: Number,
      default: 0
    },
    pagesizelist: {
      type: Array,
      default: () => [15, 20]
    },
    pageSize: {
      type: Number,
      default: 15
    },
    currentPage: {
      type: Number,
      default: 1
    }
  },
  data() {
    return {
      SoncurrentPage: this.currentPage,
      SonPagesize: this.pageSize
    }
  },
  methods: {
    handleCurrentChange(currentpage) {
      this.$emit('getAdminRative', [this.SonPagesize, currentpage])
    },
    handleSizeChange(pagesize) {
      this.SonPagesize = pagesize
      this.gobackone()
      this.$emit('getAdminRative', [pagesize, this.SoncurrentPage])
    },
    gobackone() {
      this.SoncurrentPage = 1
    },
    clear() {
      this.SoncurrentPage = 1
      this.SonPagesize = 15
    }
  }
}
</script>
<style lang="less" scoped>
.el-pagination {
  text-align: center;
  margin-top: 20px;
}
/deep/ .el-pagination__editor.el-input {
  width: 46px !important;
}
</style>
